<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/normalize.css">
	<link rel="stylesheet" href="css/font-awesome.css">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/templatemo-style.css">
		<style type="text/css">			
			.ubox{width: 46%;height: 130px;background:white;float:left;margin:20px 0px 0px 22px;
					padding-top: 15px;position: relative;}
			.uhead{width:90px ;height: 90px;border-radius: 50%;float:left;border: solid 1px;
					margin: 10px 0px 10px 5px;position: relative;overflow:hidden;}
			.uhead img{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
			.uboxtext{width: 300px;height: 120px;float: left;margin-left: 5px;border: solid 1px;}
			.gzmsg{width: 100%;height: 30px;float: left;}
			li{list-style: none;}
			p{display: inline;}
			.qxgz{position: absolute;bottom: 3px;right:85px;}
			.ubox input{visibility: hidden;}
			
		</style>
		<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.4.5/themes/default/easyui.css">
			<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.4.5/themes/icon.css">		
			<script type="text/javascript" src="js/jquery-easyui-1.4.5/jquery.min.js"></script>
			<script type="text/javascript" src="js/jquery-easyui-1.4.5/jquery.easyui.min.js"></script>
			<script type="text/javascript" src="js/jquery-easyui-1.4.5/locale/easyui-lang-zh_CN.js"></script>
		<script type="text/javascript">
			function refresh(){
				location.reload()
			}
			function test(a){
				var nickname = $(this).next().attr("name");
			    console.log(nickname);
			    $.ajax({
			      type:"post",
			      url:"newMessageByNickname",
			      dataType:"json",
			      data:{
			        "nickname":nickname
			      },
			      success:function(d){
			        window.parent.location.href="messageCenter.html";
			      }
			    });
			};
$(function(){			
	$.ajax({
		url:"user?method=getFriends",
		dataType:"json",
		success:function(d){
			console.log(d.list.length);
			for (var i = 0; i < d.list.length; i++) {
			var ubox=$("<div class='ubox'><div class='uhead'></div></div>");
			var headimg=$("<img src=\"\" class=\"headimg\"/>");
			var uheaddiv=ubox.children(":last");
			uheaddiv.append(headimg);
			console.log(uheaddiv);
			var imgSize=new Image();
			imgSize.src=d.list[i].user.userhead;
			var width=imgSize.width;
			var height=imgSize.height;
			console.log(width+","+height);
			if(width>height){
				headimg.css("height","90px");
			}else{
				headimg.css("width","90px");
			}
			console.log(headimg.css("height"));
			console.log(headimg.css("width"));
			//if(headimg.css("height")=="0px"||headimg.css("width")=="0px"){
	        //	   refresh();
	         //  } 
			headimg.attr("src",d.list[i].user.userhead); 
			var uboxtext=$("<div class=uboxtext></div>");
			var gzmsg1=$("<div class=\"gzmsg\"><p>昵称："+d.list[i].user.nickname+"</p></div>");
			var gzmsg2=$("<div class=\"gzmsg\"><p>等级："+d.list[i].user.level+"</p></div>");
			var gzmsg3=$("<div class=\"gzmsg\"><p>最后发帖时间："+d.list[i].lasttime.split(".")[0]+"</p></div>");
			var gzmsg4=$("<div class=\"gzmsg\"><p>关注时间："+d.list[i].guantime.split(".")[0]+"</p></div>");
			var but=$("<button class=\"qxgz\" onclick=\"test(this)\"><i class=\"fa fa-envelope\"></i></button>");
			var frendid=$("<input type=\"text\" name='"+d.list[i].user.nickname+"' value="+d.list[i].user.uid+" />")
			uboxtext.append(gzmsg1);	
			uboxtext.append(gzmsg2);
			uboxtext.append(gzmsg3);
			uboxtext.append(gzmsg4);
			ubox.append(uboxtext);
			ubox.append(but);
			ubox.append(frendid);
			$("body").append(ubox);
			}
		}				
	})				
});
			
			
		</script>
	</head>
	<body >	
			
						
			<!--<div class="ubox">
				<div class="uhead">	
				</div>
				<div class="uboxtext">
					<div class="gzmsg">
						<p>昵称：zs</p>
					</div>
					<div class="gzmsg">
						<p>等级：3级</p>
					</div>
					<div class="gzmsg">
						<p>最后发帖时间：2022-08-21</p>
					</div>
					<div class="gzmsg">
						<p>关注时间：2022-08-25</p>
						
					</div>
				</div>
				<button class="qxgz" onclick="test(this)">发送站内信</button>
				<input type="text" id="frid" value="15139864091" />
			</div>
			<div class="ubox">
				<div class="uhead">	
				</div>
			</div>
			<div class="ubox">
				<div class="uhead">					
				</div>
			</div>
			<div class="ubox">
				<div class="uhead">	
				</div>
			</div>
			<div class="ubox">
				<div class="uhead">					
				</div>
			</div>
			<div class="ubox">
				<div class="uhead">					
				</div>
			</div>
		-->
		
	</body>
</html>
